﻿@using CommonApp.Models
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<div id="operation" class="ui-tabs">
    <ul class="ui-tabs-nav ui-widget-header ui-corner-all">
        @foreach (OperationStep step in ViewBag.Steps)
        {
            if (ViewBag.ActiveStep.Equals(step))
            {
            <li id="@step.Uid" class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active">
                <a href="@step.GoTo" onclick="submitForm(this); return false;">@step.Name</a></li>
            }
            else
            {
            <li id="@step.Uid" class="ui-state-default ui-corner-top @if (!step.IsVisible)
                                                                     {
                                                              <text>invisible</text>
                                                                     }"><a href="@step.GoTo" onclick="submitForm(this);  return false;">@step.Name</a></li>
            }
        }
    </ul>
    <div>
        @RenderBody()
    </div>
</div>
@if (ViewBag.AutoPayment != null)
{
<form id="autoPaymentForm" name="cardsForm" action="#" method="POST">
<input id="cardNumber" name="cardNumber" type="hidden" value="@ViewBag.AutoPayment.CardNumber" />
<input id="paymentId" name="paymentId" type="hidden" value="@ViewBag.AutoPayment.PaymentId" />
<input id="autoPaymentId" name="autoPaymentId" type="hidden" value="@ViewBag.AutoPayment.AutoPaymentId" />
<input id="currency" name="currency" type="hidden" value="@ViewBag.AutoPayment.Currency" />
</form>
}

@section script {
   @RenderSection("cardsScript", false)
    @RenderSection("statementScript", false)
}
<script type="text/javascript">
    function submitForm(self) {
        var url = $(self).attr('href');
        if (formProtection) {
            formProtection = false;
            form = $('#autoPaymentForm');
            if (form) {
                form.attr('action', url);
                $('#autoPaymentForm').submit();
            }
        }
        return false;
    }
    $(function () {
        formProtection = true;
        var toggleUIMenuItemState = function (menuItem) {
            $(menuItem).toggleClass("ui-state-hover");
        };

        $("#operation ul li").hover(function () { toggleUIMenuItemState(this); },
        function () { toggleUIMenuItemState(this); });


    });
</script>
@section css {
    <link href="@Url.Content("~/Content/OperationStepStyles.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/silk.css")" rel="stylesheet" type="text/css" />
}
